<template>
  <view class="channel-merchant-card px-32rpx py-32rpx flex justify-between" @click="handleToMember">
    <view class="left flex flex-items-center">
      <image
        class="w-64rpx h-64rpx pr-24rpx"
        src="https://mingtu-resources.oss-cn-shenzhen.aliyuncs.com/mtym-app-assets/icon_gold_channel.svg"
      ></image>
      <view class="flex flex-col">
        <image
          class="w-112rpx h-48rpx"
          src="https://mingtu-resources.oss-cn-shenzhen.aliyuncs.com/mtym-app-assets/icon-gold-channel-sign.svg"
        ></image>
        <text v-if="userInfo.goldChannelFlag === 0" class="text-24rpx text-#FFFFFF">成为盟友合伙人，享受多项权益</text>
        <text v-else class="text-24rpx text-#FFFFFF">您已成为盟友合伙人，尽情享受权益吧!</text>
      </view>
    </view>
    <view class="right" @click="handleToMember">
      <view v-if="userInfo.goldChannelFlag === 0" class="title">去了解</view>
      <view v-else class="title">邀约码</view>
    </view>
  </view>
</template>

<script name="channelMerchantCard" setup>
const props = defineProps({
  userInfo: {
    type: Object,
    default: () => {}
  }
});
const handleToMember = () => {
  uni.navigateTo({
    url: '/subMember/pages/memberCenter?type=1'
  });
};
</script>

<style lang="scss" scoped>
.channel-merchant-card {
  background: linear-gradient(132deg, #0f0f0f 0%, #363636 100%);
  border-radius: 4px;
  .right {
    display: flex;
    justify-content: space-around;
    align-items: center;
    .title {
      width: 120rpx;
      height: 64rpx;
      font-size: 24rpx;
      background: linear-gradient(90deg, #ead095 0%, #d5b27c 100%);
      border-radius: 99px 99px 99px 99px;
      display: flex;
      justify-content: space-around;
      align-items: center;
    }
  }
}
</style>
